
import { format } from 'date-fns';
import { useEffect, useState } from 'react';
import { useDispatch } from 'react-redux';
import { useParams } from 'react-router-dom';
import BackButton from 'src/component/BackButton';
// import { Announcement as AnnouncementData } from 'src/model/Announcement';
import { openSnackbar } from 'src/redux/uiSlice';
// import { getAnnouncementById } from 'src/service/announcementService';
import { getNoticeInfo } from 'src/service/sysConfigService'
import CryptoJS from 'crypto-js'
import style from './AnnouncementDetail.module.scss';

type AnnouncementData = any


const AnnouncementDetail = () => {
    const { id } = useParams<{ id: string }>();
    const dispatch = useDispatch();
    const [announcement, setAnnouncement] = useState<AnnouncementData>();
    const [text, setText] = useState<any>("");
    const token = localStorage.getItem("token")
    useEffect(() => {
        if (id === undefined) return;
        getNoticeInfo({
            token: token,
            id: id,
        }).then(res => {
            if (res.success) setAnnouncement(res.list[0])
        })
        // getAnnouncementById(id)
        //     .then((res) => setAnnouncement(res))
        //     .catch((e) => dispatch(openSnackbar({ message: e, severity: 'alert' })));
    }, [id]);

    useEffect(() => {
        if (!announcement?.FGgNr) return;
        // let text = announcement?.FGgNr

        // console.log(announcement?.FGgNr)
        // var words = CryptoJS.enc.Base64.parse(text);
        // setText(words.toString(CryptoJS.enc.Utf8))
        // console.log(text)
        setText(unescape(announcement?.FGgNr) )
        // setText(decodeURI(text))

    }, [announcement?.FGgNr]);
    // function HTMLDecode(text) {
    //     var words = CryptoJS.enc.Base64.parse(text);
    //     return words.toString(CryptoJS.enc.Utf8);
    // }

    // const HTMLDecode = (text: any) => {
    //     debugger;
    //     if (!text) return
    //     var words = CryptoJS.enc.Base64.parse(text);
    //     return words.toString(CryptoJS.enc.Utf8);
    // }
    return (
        <div>
            <BackButton />
            <div className={style.headingBlock}>
                <div className={style.heading}>{announcement?.FGgBt}</div>
            </div>
            {announcement && (
                <div className={style.time}>
                    {format(Date.parse(announcement.FAddtime), 'yyyy-MM-dd HH:mm')}
                </div>
            )}
            <div className={style.divider} />
            <div className={style.content} dangerouslySetInnerHTML={{ __html: text }}></div>
        </div>
    );
};

export default AnnouncementDetail;
